﻿<div class="layui-card" id="lg-FormList">
    <div class="layui-card-header"><i class="fa fa-home fa-fw"></i>表单管理</div>
    <div class="layui-card-body" id="">
        <form class="layui-form layui-form-pane" action="" id="fm_EditTemplate" lay-filter="fm_EditTemplate">
            <div class="lg-form-box">
                <table class="layui-hide" id="FormList" lay-filter="FormList"></table>
            </div>
            <!-- 内容主体区域结束 -->
            <!--弹出层  -->
        </form>
    </div>
     <!--弹窗  -->
    <div class="lg-popup-shadow" id="tplEditWrap" v-show="flag">
        <div class="lg-popup-container" style="width:80%;">
            <div class="lg-popup-title "><span>标题</span><span class="fa fa-close" v-on:click="flag=false"></span></div>
            <div class="lg-popup-content">
                <textarea id="formTemplate" name="Text" style="height:500px;overflow:auto"></textarea>
                <div style="text-align:center;padding:15px 0">
                    <button class="layui-btn" v-on:click="onFormSubmit">立即提交</button>
                </div>
            </div>
        </div>
    </div>
     <!--弹窗结束  -->
</div>
<script type="text/html" id="formListToolbar">
    <div class="layui-btn-container">
        <span class="layui-btn layui-btn-sm layui-btn-normal" lay-event="add"><i class="fa fa-plus fa-fw"></i>添加</span>
        <button class="layui-btn layui-btn-sm layui-btn-primary" lay-event="refresh"><i class="fa fa-refresh fa-fw"></i>刷新</button>
    </div>
</script>
<script type="text/html" id="btTpl">
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit" title="编辑"><span class="fa fa-pencil-square-o fa-fw "></span></a>
    <a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="del" title="删除"><span class="fa fa-trash-o fa-fw"></span></a>
    <a class="layui-btn layui-btn-xs layui-btn-normal" title="简历模版"  lay-event="editTemplate"><span class="fa fa-vcard-o fa-fw "></span></a>
</script>
<script>
    var page = frame.createPage({
        mounted: function () {
            var page = this;
            UE.delEditor("formTemplate");
            var editor = UE.getEditor('formTemplate', {
                autoHeightEnabled: false,
                autoFloatEnabled: false
            });
            page.vm = Vue.createApp({
                data() {
                    return {
                        id: "",
                        template: '',
                        flag: false
                    }
                },
                methods: {
                    onFormSubmit() {
                        var that=this;
                        editor.ready(function(){
                            that.template=this.getContent();
                            that.editTemplate();
                        })
                    },
                    editTemplate:function(){
                        
                        lg.request({
                            url: "/api/sys/recruit/EditForm",
                            method: "post",
                            data: {
                                Id: this.id,
                                Template: this.template
                            },
                            success: res => {
                                if (res.code == 0) {
                                    layer.msg("提交成功！", { icon: 1 });
                                    this.flag=false;
                                    page.laytable.reload();
                                } else {
                                    layer.msg(res.msg, { icon: 2 })
                                }
                            }
                        })
                    }
                },
                mounted: function () {
                    //点击查看求职详情
                    const that = this
                    layui.use(['table', 'element', 'form'], function () {
                        var table = layui.table;
                        var form = layui.form;
                        form.render();

                        page.laytable = table.render({
                            elem: '#FormList'
                            , url: '/Api/sys/recruit/GetFormList'
                            , toolbar: '#formListToolbar' //开启头部工具栏，并为其绑定左侧模板
                            , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                            , cols: [[
                                { type: 'checkbox' }
                                , {
                                    field: 'Id', title: '序号', width: 80, templet: function (d) {
                                        return d.LAY_TABLE_INDEX + 1;
                                    }
                                }
                                , { field: 'Title', title: '表单名称', width: 250 }
                                , { field: 'Intro', title: '描述' }   
                                , { field: 'AddTime', title: '添加时间', width: 130 }
                                , {
                                    field: 'IsDefault', title: '默认', width: 100, templet: function (d) {
                                        return laySwitch.render(d.IsDefault, 'default');
                                    }
                                }
                                , {
                                    field: 'IsUsing', title: '状态', width: 100, templet: function (d) {
                                        return laySwitch.render(d.IsUsing, 'use');
                                    }
                                }
                                
                                , { fixed: 'right', title: '操作', width: 160, toolbar: '#btTpl' }
                            ]]
                            , page: true
                        });

                        table.on('toolbar(FormList)', function (obj) {
                            var checkStatus = table.checkStatus(obj.config.id);
                            switch (obj.event) {
                                case 'add':
                                    frame.NavigateTo({
                                        url: "/lgm/recruit/Form/add/",
                                        title: "添加表单"
                                    })
                                    break;
                                case 'refresh':
                                    page.laytable.reload();
                                    break;
                            };
                        })
                        table.on('tool(FormList)', function (obj) {
                            var data = obj.data;
                            switch (obj.event) {
                                case 'use':
                                    laySwitch.do({
                                        obj: obj,
                                        key: "IsUsing",
                                        url: "/Api/sys/recruit/EditForm",
                                        refresh: function () {
                                            // page.laytable.reload();
                                        }
                                    })
                                    break;
                                case 'default':
                                    laySwitch.do({
                                        obj: obj,
                                        key: "IsDefault",
                                        url: "/Api/sys/recruit/EditForm",
                                        refresh: function () {
                                            page.laytable.reload();
                                        }
                                    })
                                    break;
                                case 'edit':
                                    frame.NavigateTo({
                                        url: "/lgm/recruit/Form/Edit/" + data.Id,
                                        title: "编辑表单"
                                    })
                                    break;
                                case 'del':
                                    layer.confirm('真的删除行么', function (index) {
                                        lg.request({
                                            url: "/Api/sys/recruit/deleteForm",
                                            method: "post",
                                            data: { id: data.Id },
                                            success: res => {
                                                if (res.code == 0) {
                                                    obj.del();
                                                }
                                            }
                                        })
                                        layer.close(index);
                                    });
                                    break;
                                case 'editTemplate':
                                    that.id=data.Id;
                                    editor.ready(function(){
                                        this.setContent(data.Template)
                                    })
                                    that.flag=true;
                                    break;
                            };
                        })
                    });
                }
            }).mount("#lg-FormList")
        }
    }).mount();


</script>